<template>
  <div class="app-container">
    <el-form :model="form" ref="form"  label-width="100px">
      <div style="margin-top: -40px;">
        <div style="font-size: 20px; margin-bottom: 20px;">基本信息
        </div>
        <el-row>
          <el-col :span="12">
            <el-form-item label="订单编号" width="400px">
              <span>{{ form.orderNo }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单类型" width="400px">
              <span>{{ form.orderTypeName }}</span>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="12">
            <el-form-item label="供应商名称" width="400px">
              <span>{{ form.supplierName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="客户名称" width="400px">
              <span>{{ form.customerName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="手机号码" width="400px">
              <span>{{ form.phone }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单状态" width="400px">
              <span>{{ form.orderStatusName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="支付状态" width="400px">
              <span>{{ form.payStatusName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付方式" width="400px">
              <span>{{ form.payMethodName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="订单来源" width="400px">
              <span>{{ form.platSourceName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="订单金额" width="400px">
              <span>{{ form.orderAmountStr }}元</span>
            </el-form-item>
          </el-col>
        </el-row>


        <el-row>
          <el-col :span="12">
            <el-form-item label="支付金额" width="400px">
              <span>{{ form.payAmountStr }}元</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="折扣金额" width="400px">
              <span>{{ form.discountAmountStr }}元</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="优惠金额" width="400px">
              <span>{{ form.useCouponAmountStr }}元</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="金币支付" width="400px">
              <span>{{ form.payByBalanceStr }}元</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="货币单位" width="400px">
              <span>{{ form.currencyUnit }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="支付时间" width="400px">
              <span>{{ form.payTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="下单时间" width="400px">
              <span>{{ form.createTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="取消时间" width="400px">
              <span>{{ form.cancelTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="买家留言" width="400px">
              <span>{{ form.buyMes }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="过期时间" width="400px">
              <span>{{ form.expireDate }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="订单备注" width="400px">
              <span>{{ form.remark }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="ip地址" width="400px">
              <span>{{ form.ip }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="开票状态" width="400px">
              <span>{{ form.invoiceStatusName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="配送方式" width="400px">
              <span>{{ form.deliverMethodName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="发货时间" width="400px">
              <span>{{ form.sendTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="发货状态" width="400px">
              <span>{{ form.sendStatusName }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="包裹状态" width="400px">
              <span>{{ form.orderPackStatusName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="签收时间" width="400px">
              <span>{{ form.signTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="收货时间" width="400px">
              <span>{{ form.receiveTime }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="自动收货时间" width="400px">
              <span>{{ form.autoReceiveTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="评价状态" width="400px">
              <span>{{ form.commentStatusName }}</span>
            </el-form-item>
          </el-col>
          <el-col :span="12">
            <el-form-item label="评价时间" width="400px">
              <span>{{ form.commentTime }}</span>
            </el-form-item>
          </el-col>
        </el-row>

        <!-- <el-row>
          <el-col :span="12">
            <el-form-item label="商品轮播图片">
              <el-image :z-index="zIndex" :preview-src-list="carouselImgs" v-for="(imgm,index) in carouselImgs"
                :src="carouselImgs[index]" :key="index" style="width: 80px;height: 80px;margin-left: 10px">
              </el-image>
            </el-form-item>
          </el-col>
        </el-row>

        <el-row>
          <el-col :span="12">
            <el-form-item label="商品详情图片">
              <el-image :z-index="zIndex" :preview-src-list="detailImgs" v-for="(imgm,index) in detailImgs"
                :src="detailImgs[index]" :key="index" style="width: 80px;height: 80px;margin-left: 10px">
              </el-image>
            </el-form-item>
          </el-col>
        </el-row> -->


        <!-- <div style="font-size: 20px; margin-bottom: 30px;">开票信息
          <el-row>
            <el-col :span="12">
              <el-form-item :label="item.specsName" v-for="item in form.invoice" :key="item.valuesName">
                <span>{{ item.valuesName }}</span>
              </el-form-item>
            </el-col>
          </el-row>
        </div> -->
      </div>
    </el-form>

  </div>
</template>

<script>
  export default {
    props: ["form"],
    data() {
      return {
        zIndex: 3000,
      }
    },
    methods: {
    },
  };
</script>

<style scoped>
  .el-form-item {
    margin-bottom: 0;
  }
</style>
